<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script src="js/jquery-3.6.0.min.js" type="text/javascript" charset="utf-8"></script>
		
		<script>
			$(function(){
				
				
				// https://www.w3school.com.cn/cssref/css_selectors.asp
				
				// id选择
				// $("#div01").css("background-color","lightcoral");
				// class选择
				// $(".c1").css("background-color","lightcoral");
				// 标签选择器
				// $("div").css("background-color","lightcoral");
				// 属性选择器
				// $("[id]").css("background-color","lightcoral");
				// $("[type=text]").css("background-color","lightcoral");
				
				
				// 伪元素 伪类选择器
				// $("div:first").css("background-color","lightcoral");
				// $("div:last").css("background-color","lightcoral");
				// $("div:eq(3)").css("background-color","lightcoral");
				// $("div:gt(1)").css("background-color","lightcoral");
				// $("div:lt(2)").css("background-color","lightcoral");
				
				// 在所在父元素下是大儿子
				// $("div:first-child").css("background-color","lightcoral");
				// $("div:last-child").css("background-color","lightcoral");
				$("div:nth-child(3)").css("background-color","lightcoral");
			});
		</script>
	</head>
	<body>
		<h1>测试</h1>
		<div>
			<div id="div01">aaa</div>
			<div id="div02" class="c1">bbb</div>
			<div >ccc</div>
			<div id="div04" class="c1">ddd</div>
		</div>
		
		<div>
			<form>
				<input type="t// sword" name="password" />
			</form>
		</div>
	</body>
</html>
